<template>
  <div>
    <!-- header -->
    <van-sticky :offset-top="0">
      <div class="header">
        <input type="text" class="search" placeholder="请输入商家或商口名称">
      </div>
    </van-sticky>
    <category></category>
    <div class="title">附近商家</div>
    <list></list>
  </div>
</template>
<script>
import category from './category'
import list from './list'
export default {
  components: {
    category,
    list
  }
}
</script>
<style lang="scss" scoped>
.header {
  background-color: #1c1b20;
  padding: .2rem;
  .search {
    width: 100%;
    border: none;
    line-height: .6rem;
    border-radius: .3rem;
    padding: 0 .2rem;
    box-sizing: border-box;
  }
}
.title {
  font-size: .34rem;
  font-weight: bold;
  text-align: center;
  line-height: .46rem;
  margin: .3rem 0 0 .1rem;
  &::after, &::before {
    content: "";
    height: 1px;
    transform: scaleY(.5);
    width: 30px;
    display: inline-block;
    background: #666;
    vertical-align: middle;
  }
}
</style>
